<template>
    <div class="main">
        <div class="search">
            
            <div class="block">
                <span> 手机号码: </span>
                <el-input placeholder="请输入手机号码"
                    v-model="mobile"
                    style="width:200px"
                ></el-input>
            </div>
            <div class="block">
                <el-button type="primary" style="width:80px" @click="search()" size="small">查询</el-button>
            </div>
        </div>
        <div class="userTable" >
            <el-table :data="tableData" style="width: 100%" >
                <el-table-column prop="ID" label="ID"  width="80" align="center"></el-table-column>
                <el-table-column prop="mobile" label="手机号" width="150" align="center"></el-table-column>
                <el-table-column prop="nickName" label="昵称" width="150" align="center"></el-table-column>
                <el-table-column prop="email" label="Email" width="150" align="center"></el-table-column>
                <el-table-column prop="qq" label="QQ" width="150" align="center"></el-table-column>
                <el-table-column prop="company" label="公司" width="150" align="center"></el-table-column>
                <el-table-column prop="position" label="职位" width="150" align="center"></el-table-column>
                <el-table-column prop="wechat" label="微信号" width="150" align="center"></el-table-column>
                <el-table-column prop="avatar" label="头像" width="150" align="center"></el-table-column>
                <el-table-column prop="registerTime" label="注册时间" width="160" align="center"></el-table-column>
            </el-table>
        </div>
    </div>
</template>

<script>
export default {
    name: "home",
    data(){
        return {
            tableData: [{
                ID: 4475,
                mobile: "18069543226",
                nickName: "姑婆用户3326",
                email: "",
                qq: "",
                company: "",
                position: "",
                wechat: "",
                avatar: "",
                registerTime: "2020-08-21 10:30:00"
            },
            {
                ID: 4474,
                mobile: "18069543226",
                nickName: "姑婆用户9737",
                email: "",
                qq: "5444114467",
                company: "无",
                position: "无",
                wechat: "",
                avatar: "",
                registerTime: "2020-08-21 10:30:00"
            },
            ],
            mobile: ""
        }
    },
  mounted() {
    console.log("生命周期mounted");
  },
};

</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
@import "../../css/user.scss";
</style>